<template>
    <div>
        <VueForm v-model="formData" :schema="schema">
        </VueForm>
    </div>
</template>
<script>



//  使用
import VueForm from '@lljj/vue3-form-ant';

export default {
    name: 'Demo',
    components: {
        VueForm
    },
    data() {
        return {
            formData: {},
            schema: {
                type: 'object',
                required: [
                    'userName',
                    'age',
                    'sex'
                ],
                properties: {
                    switch: {
                        type: 'boolean',
                        title: '开还是关'
                    },
                    userName: {
                        type: 'string',
                        title: '用户名',
                        default: 'Liu.Jun',
                    },
                    age: {
                        type: 'number',
                        title: '年龄',
                        minimum: 10,
                        maximum: 99,
                        default: 18
                    },
                    sex: {
                        type: 'string',
                        title: '性别'
                    },
                    numberEnum: {
                        type: 'number',
                        title: '数组枚举 (select)',
                        enum: [1, 2, 3],
                        enumNames: ['Select - 1', 'Select - 2', 'Select - 3']
                    },
                    bio: {
                        type: 'string',
                        title: '签名',
                        minLength: 10,
                        default: '知道的越多、就知道的越少',
                        'ui:options': {
                            placeholder: '请输入你的签名',
                            type: 'textarea',
                            rows: 1
                        }
                    }
                }
            },
            errorSchema: {
                age: {
                    'err:options': {
                        required: '请输入年龄 10 - 99'
                    }
                }
            }
        };
    }
};

</script>